<template>
  <a-spin :spinning="spinning" tip="正在加载中...." delay="500" :indicator="indicator" >
    <a-config-provider :locale="locale === 'en' ? enUS : zhCN">
      <KeepAlive>
        <RouterView />
      </KeepAlive>
    </a-config-provider>
  </a-spin>
</template>
<script setup lang="ts">
import { useSpinningStore } from '@/stores/useSpinning'
import { LoadingOutlined } from '@ant-design/icons-vue';
import { h } from 'vue';
const indicator = h(LoadingOutlined, {
  style: {
    fontSize: '24px',
  }
});
import { useLocaleStore } from '@/stores/useLocaleStore'
import { RouterView } from 'vue-router'
import zhCN from 'ant-design-vue/es/locale/zh_CN'
import enUS from 'ant-design-vue/es/locale/en_US'
import { storeToRefs } from 'pinia'
const { locale } = storeToRefs(useLocaleStore())
const { spinning } = storeToRefs(useSpinningStore())
</script>
<style>
* {
  margin: 0;
  padding: 0;
}
.ant-steps.ant-steps-small .ant-steps-item-custom .ant-steps-item-icon > .ant-steps-icon {
  font: 16px !important;
}
.icon {
  width: 1em;
  height: 1em;
  vertical-align: -0.15em;
  fill: currentColor;
  overflow: hidden;
}
</style>
